<template>
  <div class="clearfix table-out search">
    <el-button
      type="primary"
      plain
      size="small"
      class="return pointer"
      @click="returnGo"
      ><i class="iconfont icon-fanhui"></i> 返回
    </el-button>
    <div class="clearfix top-return search-pub">
      <el-form :model="formData" label-width="auto">
        <el-form-item
          class="fxl margin10R"
          v-for="(item, idx) in soustjList"
          :key="idx"
        >
          <el-input
            :placeholder="`请输入${item.biaot}`"
            class="pub-inp-wid"
            v-model="formData[item.zidmc]"
            v-if="item.biaodkjlx == '1'"
          />
          <el-select
            style="width: 200px"
            :placeholder="`请选择${item.biaot}`"
            v-if="item.biaodkjlx == '2'"
            v-model="formData[item.zidmc]"
          >
            <el-option
              v-for="item2 in item.kongjsj.split(';')"
              :label="item2.split(',')[0]"
              :value="item2.split(',')[1]"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-button class="fxl" type="primary" @click="getData()"
          >查询</el-button
        >
        <el-button class="fxl" type="primary" @click="reset">重置</el-button>
      </el-form>
    </div>
    <el-table
      :data="tableData"
      empty-text=" "
      class="tablePub top-return"
      :row-class-name="tableRowClassName"
    >
      <el-table-column label="序号" type="index" :index="getIndex" width="70" />

      <el-table-column
        width="200"
        prop="saisjcid_dictText"
        label="赛事进程"
      ></el-table-column>

      <el-table-column
        :prop="item.zidmc"
        :label="item.biaot"
        v-for="(item, idx) in tableHeader"
        :key="idx"
        :width="item.width"
        align="center"
      >
      </el-table-column>

      <el-table-column prop="oper" label="操作" width="140" align="left">
        <template #default="scope">
          <div class="text-left" style="text-left;width:100%">
            <el-button
              v-if="
                scope.row.saisjc_id == '1863825505802035202' ||
                scope.row.saisjc_id == '1883284539901878274'
              "
              type="primary"
              size="small"
              @click="oper(scope.$index, scope.row, 2)"
              >编辑</el-button
            >
            <el-button
              v-else
              size="small"
              @click="oper(scope.$index, scope.row, 1)"
              >查看</el-button
            >

            <el-popconfirm
              v-if="scope.row.saisjc_id == '1863825505802035202'"
              title="确认删除么?"
              confirm-button-text="是"
              cancel-button-text="否"
              @confirm="confirmEvent(scope.$index, scope.row)"
            >
              <template #reference>
                <el-button size="small">删除</el-button>
              </template>
            </el-popconfirm>
          </div>

          <!--          <el-button-->
          <!--            type="success"-->
          <!--            size="small"-->
          <!--            @click="outpdf(scope.$index, scope.row)"-->
          <!--            >导出pdf</el-button>-->
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      :current-page="pageNo"
      :page-size="pageSize"


      @current-change="handleCurrentChange"
      small
      background
      layout="total, prev, pager, next"
      :total="total"
      class="pagination fxr"
    />
    <!--    -->
    <form-data-pdf
      v-show="pdfStatic"
      :pdfTitle="pdfTitle"
      :pdf-title-sub="pdfTitleSub"
      :form-data="pdfData"
      ref="formDataPdfRef"
    ></form-data-pdf>
  </div>
</template>

<script>
import pubJs from "./pub";
import axios from "axios";

export default {
  mixins: [pubJs],
  data() {
    return {
      formData: {},
      soustjList: [],
      userInfo: JSON.parse(localStorage.getItem("userInfo")),
      tableHeader: [],
      pdfData: [],
      pdfStatic: false,
    };
  },

  inject: ["imageUrl", "serviceUrl"],

  async mounted() {
    let that = this;
    this.pdfStatic = false;
    that.saisId = this.$route.query.saisId;
    that.getData();
    await this.getDongtsstjlb(this.saisId);

    // 作品表字段
    axios
      .get(that.serviceUrl + "/saisjczd2/cbda2Saisjczd/getWodzpzd", {
        headers: {
          "X-Access-Token": localStorage.getItem("token"),
        },
        params: {
          cansrsf: that.userInfo.cansrsf,
          saisId: that.saisId,
          _t: new Date().getTime(),
        },
      })
      .then((resp) => {
        resp.data.result.forEach((item, index) => {
          console.log(item);
          that.tableHeader.push({
            ...item,
            width:
              item.zidmc == "create_time"
                ? 200
                : item.zidmc == "zuopzt"
                ? 260
                : "",
          });
        });
      })
      .catch((error) => {
        //console.log(error);
      });

    this.searchFormData = JSON.parse(localStorage.getItem("searchFormData"));
    if (this.searchFormData && Object.keys(this.searchFormData).length != 0) {
      this.pageNo = this.searchFormData.pageNo
        ? this.searchFormData.pageNo
        : "";
    }
  },

  methods: {
    confirmEvent(idx, row) {
      let that = this;

      axios
        .delete(that.serviceUrl + "/saisjczd2/cbda2Saisjczd/deleteZuop", {
          headers: {
            "X-Access-Token": localStorage.getItem("token"),
          },

          params: {
            saisId: that.saisId,
            zuopId: row.id,
          },
        })
        .then((resp) => {
          this.$message.success("删除成功");
          this.getData();
        })
        .catch((error) => {
          //console.log(error);
          this.$message.error(error);
        });
    },

    returnGo() {
      this.$router.go(-1); // 返回上一个页面
    },

    reset() {
      this.formData = { saisId: this.saisId };
      this.pageNo = 1;
      this.getData();
    },

    getData(v) {
      let that = this;
      that.formData.saisId = that.saisId;
      that.formData.pageNo = that.pageNo;
      that.formData.pageSize = that.pageSize;
      axios
        .post(
          that.serviceUrl + "/saisjczd2/cbda2Saisjczd/zuoplieb",
          that.formData,
          {
            headers: {
              "X-Access-Token": localStorage.getItem("token"),
            },
          }
        )
        .then((resp) => {
          that.tableData = resp.data.result.records;
          this.total = resp.data.result.total;
        })
        .catch((error) => {
          //console.log(error);
        });
    },

    withdraw(index, row) {},

    outpdf(index, row) {
      this.tableHeader.forEach((item) => {
        for (let key in row) {
          if (key == item.zidmc) {
            this.pdfData.push({
              biaot: item.biaot,
              zidmc: row[key],
              fenl24: 24,
            });
          }
        }
      });

      this.pdfStatic = true;
      setTimeout(() => {
        this.$refs["formDataPdfRef"].printOutPdf("aaaaaaaa");
        this.pdfStatic = false;
      }, 500);
      console.log(this.tableHeader, "tableHeader", row, this.pdfData);
    },

    oper(index, row, n) {
      let that = this;
      let sta = "";
      if (row.saisjc_id == "1779359204496863233") {
        sta = 1;
      } else {
        sta = n;
      }
      localStorage.setItem("formDisabled", sta);
      localStorage.setItem("topStepId", row.saisjc_id);
      localStorage.setItem(
        "searchFormData",
        JSON.stringify({ ...this.formData, pageNo: this.pageNo })
      );
      that.$router.push({
        path: "zuopxq",
        query: {
          saisqyId: row.saisqy_id,
          id: row.id,
          saisId: row.sais_id,
          saisjc: row.saisjc_id,
          formType: that.$route.query.formType,
        },
      });
    },
  },
};
</script>

<style scoped lang="less"></style>
